<template xmlns="http://www.w3.org/1999/html">
  <div class="app-container">
    <el-form :inline="true" :model="formData" class="demo-form-inline">
      <el-form-item label="对账单编号">
        <el-input v-model="formData.number" placeholder="请输入对账单编号"></el-input>
      </el-form-item>
      <el-form-item label="客户名称">
        <el-input v-model="formData.customerName" placeholder="请输入客户名称"></el-input>
      </el-form-item>
      <el-form-item label="租赁订单编号">
        <el-input v-model="formData.orderNo" placeholder="请输入租赁订单编号"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="Search">查询</el-button>
        <el-button @click="ResetList">重置</el-button>
      </el-form-item>
    </el-form>
    <el-card>
      <el-button v-hasPermi="['module:accountStatement:add']" style="margin-bottom: 10px" type="success"
                 icon="el-icon-plus" @click="openDialog">新增
      </el-button>
      <!--    租金结算单列表-->
      <el-table
        :data="list"
        style="width: 100%">
        <el-table-column
          prop="contractTemplate"
          label="合同模板"
          width="120">
        </el-table-column>
        <el-table-column
          prop="sponsorName"
          label="发起人"
          width="120">
        </el-table-column>
        <el-table-column
          prop="salesmanName"
          label="业务员"
          width="120">
        </el-table-column>
        <el-table-column
          prop="applyDate"
          label="申请日期">
        </el-table-column>
        <el-table-column
          prop="number"
          label="编号">
        </el-table-column>
        <el-table-column
          prop="customerName"
          label="客户名称">
        </el-table-column>
        <el-table-column
          prop="businessCompany"
          label="业务所属公司">
        </el-table-column>
        <el-table-column
          prop="orderNo"
          label="订单编号">
        </el-table-column>
        <el-table-column
          prop="projectName"
          label="项目名称">
        </el-table-column>
        <el-table-column
          prop="projectSource"
          label="项目信息来源">
          <template slot-scope="scope">
            <span v-if="scope.row.projectSource==1">公司</span>
            <span v-if="scope.row.projectSource==2">展会</span>
            <span v-if="scope.row.projectSource==3">个人</span>
            <span v-if="scope.row.projectSource==4">地采</span>
            <span v-if="scope.row.projectSource==5">武汉创尔</span>
            <span v-if="scope.row.projectSource==6">临沂合伙人</span>
            <span v-if="scope.row.projectSource==7">济南合伙人</span>
            <span v-if="scope.row.projectSource==8">青岛合伙人</span>
            <span v-if="scope.row.projectSource==9">北京合伙人</span>
            <span v-if="scope.row.projectSource==10">成都欧洁仓超</span>
          </template>
        </el-table-column>
        <!--      <el-table-column-->
        <!--        prop="startDate"-->
        <!--        label="起租日期">-->
        <!--      </el-table-column>-->
        <!--      <el-table-column-->
        <!--        prop="endDate"-->
        <!--        label="到租日期">-->
        <!--      </el-table-column>-->
        <el-table-column
          prop="totalDailyRent"
          label="日租金合计">
        </el-table-column>
        <!--      <el-table-column-->
        <!--        prop="rentReceivable"-->
        <!--        label="应收租金">-->
        <!--      </el-table-column>-->
        <!--      <el-table-column-->
        <!--        prop="rentAllowanceAmount"-->
        <!--        label="租金折让金额">-->
        <!--      </el-table-column>-->
        <!--      <el-table-column-->
        <!--        prop="rentAllowanceDescription"-->
        <!--        label="租金折让说明">-->
        <!--      </el-table-column>-->
        <el-table-column
          prop="relationApprovalForm"
          label="关联特殊事项审批单">
        </el-table-column>

        <el-table-column
          prop="totalOtherExpenses"
          label="其他费用总额">
        </el-table-column>

        <el-table-column
          prop="otherExpensesList"
          label="收取客户其他费用明细">
          <template slot-scope="scope">
            <el-popover
              placement="bottom"
              width="200px"
              trigger="click">
              <el-table :data="scope.row.otherExpensesList">
                <el-table-column align="center" type="index" label="序号"></el-table-column>
                <el-table-column align="center" width="100" property="expenseCategory" label="费用类别">
                  <template slot-scope="scope">
                    <span v-if="scope.row.expenseCategory==0">其他</span>
                    <span v-if="scope.row.expenseCategory==1">物流费</span>
                    <span v-if="scope.row.expenseCategory==2">维修费</span>
                  </template>
                </el-table-column>
                <el-table-column align="center" width="80" property="unit" label="单位">
                  <template slot-scope="scope">
                    <span v-if="scope.row.unit==0">其他</span>
                    <span v-if="scope.row.unit==1">台</span>
                  </template>
                </el-table-column>
                <el-table-column align="center" width="130" property="quantity" label="数量"></el-table-column>
                <el-table-column align="center" width="130" property="totalAmount" label="类别总金额"></el-table-column>
              </el-table>
              <el-button type="text" slot="reference">查看全部</el-button>
            </el-popover>
          </template>

        </el-table-column>
        <el-table-column
          prop="rentPaid"
          label="实收租金">
        </el-table-column>
        <el-table-column
          prop="depositPaid"
          label="实收押金">
        </el-table-column>
        <el-table-column
          prop="refundableDeposit"
          label="应退押金">
        </el-table-column>
        <el-table-column
          prop="accountStatementAttachments"
          label="对账单附件">
        </el-table-column>
        <el-table-column
          prop="accountNumber"
          label="退款账号">
        </el-table-column>
        <el-table-column
          prop="accountAttachments"
          label="账户附件信息">
        </el-table-column>
        <el-table-column
          prop="totalDeductibleExpenses"
          label="应扣费用总额">
        </el-table-column>
        <el-table-column
          prop="deductibleExpensesList"
          label="项目应扣费用对象">
          <template slot-scope="scope">
            <el-popover
              placement="bottom"
              width="200px"
              trigger="click">
              <el-table :data="scope.row.deductibleExpensesList">
                <el-table-column align="center" type="index" label="序号"></el-table-column>
                <el-table-column align="center" width="100" property="expenseCategory" label="费用类别">
                  <template slot-scope="scope">
                    <span v-if="scope.row.expenseCategory==0">其他</span>
                    <span v-if="scope.row.expenseCategory==1">物流费</span>
                    <span v-if="scope.row.expenseCategory==2">维修费</span>
                  </template>
                </el-table-column>
                <el-table-column align="center" width="80" property="unit" label="单位">
                  <template slot-scope="scope">
                    <span v-if="scope.row.unit==0">其他</span>
                    <span v-if="scope.row.unit==1">台</span>
                  </template>
                </el-table-column>
                <el-table-column align="center" width="130" property="amount" label="金额"></el-table-column>
                <el-table-column align="center" width="130" property="hasPaid" label="否已支付"></el-table-column>
                <el-table-column align="center" width="130" property="payer" label="支付方"></el-table-column>
              </el-table>
              <el-button type="text" slot="reference">查看全部</el-button>
            </el-popover>
          </template>
        </el-table-column>
        <el-table-column
          prop="totalLogisticsExpenses"
          label="物流项目总额">
        </el-table-column>
        <el-table-column
          prop="logisticsExpensesList"
          label="物流及辅料费用对象">
          <template slot-scope="scope">
            <el-popover
              placement="bottom"
              width="200px"
              trigger="click">
              <el-table :data="scope.row.logisticsExpensesList">
                <el-table-column align="center" type="index" label="序号"></el-table-column>
                <el-table-column width="100" property="expenseCategory" label="费用类别">
                  <template slot-scope="scope">
                    <span v-if="scope.row.expenseCategory==0">其他</span>
                    <span v-if="scope.row.expenseCategory==1">物流费</span>
                    <span v-if="scope.row.expenseCategory==2">维修费</span>
                  </template>
                </el-table-column>
                <el-table-column width="100" property="quantity" label="数量"></el-table-column>
                <el-table-column width="100" property="amount" label="金额"></el-table-column>
                <el-table-column width="80" property="model" label="型号"></el-table-column>
                <el-table-column width="100" property="date" label="日期"></el-table-column>
                <el-table-column width="100" property="payer" label="支付方"></el-table-column>

              </el-table>
              <el-button type="text" slot="reference">查看全部</el-button>
            </el-popover>
          </template>
        </el-table-column>
        <el-table-column
          prop="totalMaintenanceCost"
          label="维修项目总额">
        </el-table-column>
        <el-table-column
          prop="maintenanceCostList"
          label="维修、配件费用对象">
          <template slot-scope="scope">
            <el-popover
              placement="bottom"
              width="200px"
              trigger="click">
              <el-table :data="scope.row.maintenanceCostList">
                <el-table-column align="center" width="130" property="expenseCategory" label="费用类别">
                  <template slot-scope="scope">
                    <span v-if="scope.row.expenseCategory==0">其他</span>
                    <span v-if="scope.row.expenseCategory==1">物流费</span>
                    <span v-if="scope.row.expenseCategory==2">维修费</span>
                  </template>
                </el-table-column>
                <el-table-column align="center" width="130" property="unit" label="单位">
                  <template slot-scope="scope">
                    <span v-if="scope.row.unit==0">其他</span>
                    <span v-if="scope.row.unit==1">台</span>
                  </template>
                </el-table-column>
                <el-table-column align="center" width="100" property="remark" label="备注"></el-table-column>
                <el-table-column align="center" width="130" property="totalAmount" label="金额"></el-table-column>

              </el-table>
              <el-button type="text" slot="reference">查看全部</el-button>
            </el-popover>
          </template>
        </el-table-column>
        <el-table-column
          prop="estimateProjectProfit"
          label="项目毛利">

        </el-table-column>
        <el-table-column
          prop="signRenName"
          label="签订人名称">
        </el-table-column>
        <el-table-column
          prop="collaboratorName"
          label="协同人名称">
        </el-table-column>
        <el-table-column
          prop="status"
          label="状态">
          <template slot-scope="scope">
            <span v-if="scope.row.status==1">正常</span>
          </template>
        </el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button v-hasPermi="['module:accountStatement:edit']" type="text" @click="editFn(scope.row)">修改
            </el-button>
            <el-button v-hasPermi="['module:accountStatement:remove']" type="text" @click="delFn(scope.row.id)">删除
            </el-button>

          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="formData.pageNum"
        :page-sizes="[10, 12, 30, 50]"
        :page-size="formData.pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total">
      </el-pagination>
    </el-card>
    <!--    弹框组件-->
    <el-dialog
      :title="formData.id?'修改对账单':'新增对账单'"
      :visible.sync="isShow"
      @close="DialogClose"
      width="50%"
    >
      <el-form :model="formData" :rules="formRules" ref="form" inline label-width="130px">
        <el-form-item label="订单编号" prop="orderNo">
          <el-input style="width: 250px;" v-model="formData.orderNo">
            <template slot="append">
              <el-button style="width:60px" type="primary" @click="OpenOrderList">
                选择
              </el-button>
            </template>
            >
          </el-input>
        </el-form-item>
        <el-form-item label="合同模板" prop="contractTemplate">
          <el-select v-model="formData.contractTemplate" placeholder="合同模板">
            <el-option
              v-for="item in contractTemplateOptions"
              :key="item.dictValue"
              :label="item.dictLabel"
              :value="item.dictValue"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="发起人" prop="sponsorName">
          <el-input readonly v-model="formData.sponsorName"></el-input>
        </el-form-item>
        <el-form-item label="业务员" prop="salesmanName">
          <el-input readonly v-model="formData.salesmanName"></el-input>
        </el-form-item>
        <el-form-item label="签订人名" prop="signRenName">
          <el-input v-model="formData.signRenName"></el-input>
        </el-form-item>
        <el-form-item label="协同人" prop="collaboratorName">
          <el-input v-model="formData.collaboratorName"></el-input>
        </el-form-item>
        <el-form-item label="申请日期" prop="applyDate">
          <el-date-picker
            v-model="formData.applyDate"
            type="date"
            placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="对账单编号" prop="number">
          <el-input readonly v-model="formData.number"></el-input>
        </el-form-item>
        <el-form-item label="客户名称" prop="customerName">
          <el-input readonly v-model="formData.customerName"></el-input>
        </el-form-item>
        <el-form-item label="业务所属公司" prop="businessCompany">
          <el-input readonly v-model="businessCompany"></el-input>
        </el-form-item>

        <el-form-item label="项目名称" prop="projectName">
          <el-input readonly v-model="formData.projectName"></el-input>
        </el-form-item>
        <el-form-item label="项目信息来源" prop="projectSource">
          <el-select v-model="formData.projectSource" placeholder="项目信息来源">
            <el-option
              v-for="item in projectSourceOptions"
              :key="item.dictValue"
              :label="item.dictLabel"
              :value="item.dictValue"
            ></el-option>
          </el-select>
        </el-form-item>
        <!--        <el-form-item label="起租日期" prop="startDate">-->
        <!--          <el-date-picker-->
        <!--            v-model="formData.startDate"-->
        <!--            type="date"-->
        <!--            placeholder="选择日期">-->
        <!--          </el-date-picker>-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="到租日期" prop="endDate">-->
        <!--          <el-date-picker-->
        <!--            v-model="formData.endDate"-->
        <!--            type="date"-->
        <!--            @blur="DayFn"-->
        <!--            placeholder="选择日期">-->
        <!--          </el-date-picker>-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="使用天数" prop="usedDays"><el-input readonly v-model="formData.usedDays"></el-input></el-form-item>-->
        <el-form-item label="日租金合计" prop="totalDailyRent">
          <el-input v-model="formData.totalDailyRent" @keyup.native="validateNumberInput($event,'totalDailyRent')"
                    @blur="blurNumberInput($event,'totalDailyRent')"></el-input>
        </el-form-item>
        <el-form-item label="应收租金" prop="rentReceivable">
          <el-input v-model.number="formData.rentReceivable"></el-input>
        </el-form-item>
        <!--        <el-form-item label="租金折让" prop="rentAllowanceAmount"><el-input  v-model.number="formData.rentAllowanceAmount"></el-input></el-form-item>-->
        <br>
        <el-form-item label="折让说明" prop="rentAllowanceDescription">
          <el-input style="width: 300px;" type="textarea" v-model="formData.rentAllowanceDescription"></el-input>
        </el-form-item>
        <!--          租赁机器费用明细-->
        <el-form-item label="租赁费用">
          <el-input v-model="this.totalMachineExpense"></el-input>
        </el-form-item>
        <el-form-item label="租赁机器费用明细">
          <!--          <template slot-scope="scope">-->
          <div style="margin-left: 50px">
            <el-table :data="machineExpenseList">
              <el-table-column label="序号" type="index"></el-table-column>
              <el-table-column label="产品名称" prop="productName"></el-table-column>
              <el-table-column label="型号" prop="model"></el-table-column>
              <el-table-column label="机器编号" prop="machineNo"></el-table-column>
              <el-table-column label="出库时间" prop="outtime"></el-table-column>
              <el-table-column label="入库时间" prop="retime"></el-table-column>
              <el-table-column label="总天数" prop="allTime"></el-table-column>
              <el-table-column label="日租金" prop="dailyTotalRent"></el-table-column>
              <el-table-column label="金额" prop="rent"></el-table-column>
            </el-table>
          </div>
          <!--          </template>-->
        </el-form-item>
        <el-form-item label="产品结算表">
          <div>
            <el-form label-width="120px">

              <el-button type="primary" size="mini" @click="openProduct" style="margin-bottom: 10px">选择产品</el-button>
              <!--              <div v-for="(item,index) in  models" :key="index" style="margin-top: 10px">-->
              <div style="margin-top: 10px">
                <el-form-item :prop="'model.1'" label-width="0">
                  <div style="display:flex;">
                    <!--                    <label class="whiteBankCard"-->
                    <!--                           style="width: 100px;margin-right: 10px;text-align: center">产品名称</label>-->
                    <label class="whiteBankCard"
                           style="width: 100px;margin-right: 10px;text-align: center">型号</label>
                    <label class="whiteBankCard"
                           style="width: 150px;margin-right: 10px;text-align: center">起租时间</label>
                    <label class="whiteBankCard"
                           style="width: 150px;margin-right: 10px;text-align: center">截止时间</label>
                    <label class="whiteBankCard"
                           style="width: 80px;margin-right: 10px;text-align: center">数量</label>
                    <label class="whiteBankCard"
                           style="width: 100px;margin-right: 10px;text-align: center">日租金</label>
                    <label class="whiteBankCard"
                           style="width: 100px;margin-right: 10px;text-align: center">操作</label>

                  </div>
                  <div style="display:flex;" v-for="(item,index) in  statementExpensesList" :key="index">
                    <div :prop="'product.' + index">
                      <!--                      <el-input class="whiteBankCard" readonly  v-model="item.productName"   placeholder="产品名称"-->
                      <!--                                style="width: 100px;margin-right: 10px"></el-input>-->
                      <el-input class="whiteBankCard" readonly v-model="item.model" placeholder="型号"
                                style="width: 100px;margin-right: 10px"/>
                      <el-date-picker
                        v-model="item.startDate"
                        type="date"
                        style="width: 150px"
                        placeholder="起租时间">
                      </el-date-picker>
                      <el-date-picker
                        v-model="item.endDate"
                        type="date"
                        style="width: 150px"
                        placeholder="截止时间"></el-date-picker>
                      <el-input class="whiteBankCard" v-model="item.quantity" placeholder="数量"
                                style="width: 80px;margin-right: 10px"/>

                      <el-input class="whiteBankCard" v-model="item.dailyRent" @blur="sumMoney(index)"
                                placeholder="日租金（元／台／日）"
                                style="width: 130px;margin-right: 10px"/>


                      <el-button type="danger" size="mini" style="height: 30px; margin-left:20px"
                                 @click="removeProduct(index)">
                        删除
                      </el-button>
                    </div>
                  </div>
                </el-form-item>
              </div>
            </el-form>
          </div>
        </el-form-item>
        <el-form-item label="对账单附件" prop="accountStatementAttachments">
          <image-upload v-model="formData.accountStatementAttachments"/>
        </el-form-item>
        <el-form-item label="账户信息附件" prop="accountNumber">
          <image-upload v-model="formData.accountNumber"/>
        </el-form-item>
        <br>
        <el-form-item label="特殊事项审批单" prop="relationApprovalForm">
          <el-input v-model="formData.relationApprovalForm"></el-input>
        </el-form-item>
        <br>
        <el-form-item label="其他费用总额" prop="totalOtherExpenses">
          <el-input v-model="formData.totalOtherExpenses"></el-input>
        </el-form-item>
        <el-form-item label="收取客户其他费用" prop="otherExpensesList">
          <el-button size="mini" type="success" @click="openMOreFn(1)">添加</el-button>

          <div style="margin-top: 10px; background-color: #f1f3f4">
            <el-table :data="formData.otherExpensesList">
              <el-table-column align="center" type="index" label="序号"></el-table-column>
              <el-table-column align="center" width="100" property="expenseCategory" label="费用类别">
                <template slot-scope="scope">
                  <span v-if="scope.row.expenseCategory==1">物流费</span>
                  <span v-if="scope.row.expenseCategory==2">维修费</span>
                  <span v-if="scope.row.expenseCategory==0">其他</span>
                </template>
              </el-table-column>
              <el-table-column align="center" width="80" property="unit" label="单位">
                <template slot-scope="scope">
                  <span v-if="scope.row.unit==0">其他</span>
                  <span v-if="scope.row.unit==1">台</span>
                </template>
              </el-table-column>
              <el-table-column align="center" width="130" property="quantity" label="数量"></el-table-column>
              <el-table-column align="center" width="130" property="totalAmount" label="类别总金额"></el-table-column>
              <el-table-column align="center" width="100" label="操作">
                <template slot-scope="scope">
                  <el-button type="danger" size="mini" @click="delHand(scope.$index,1)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>

        </el-form-item>
        <br>
        <el-form-item label="应扣费用总额" prop="totalDeductibleExpenses">
          <el-input v-model="formData.totalDeductibleExpenses"></el-input>
        </el-form-item>
        <el-form-item label="项目应扣费用对象" prop="deductibleExpensesList">
          <el-button size="mini" style="margin-left: 50px" type="success" @click="openMOreFn(2)">添加</el-button>
          <div style="margin-top: 10px;background-color: #f1f3f4 ;margin-left: 50px">
            <el-table :data="formData.deductibleExpensesList">
              <el-table-column align="center" type="index" label="序号"></el-table-column>
              <el-table-column align="center" width="100" property="expenseCategory" label="费用类别">
                <template slot-scope="scope">
                  <span v-if="scope.row.expenseCategory==1">物流费</span>
                  <span v-if="scope.row.expenseCategory==2">维修费</span>
                  <span v-if="scope.row.expenseCategory==0">其他</span>
                </template>
              </el-table-column>
              <el-table-column align="center" width="80" property="unit" label="单位">
                <template slot-scope="scope">
                  <span v-if="scope.row.unit==0">其他</span>
                  <span v-if="scope.row.unit==1">台</span>
                </template>
              </el-table-column>
              <el-table-column align="center" width="130" property="amount" label="金额"></el-table-column>
              <el-table-column align="center" width="130" property="hasPaid" label="否已支付"></el-table-column>
              <el-table-column align="center" width="130" property="payer" label="支付方"></el-table-column>
              <el-table-column align="center" width="100" label="操作">
                <template slot-scope="scope">
                  <el-button type="danger" size="mini" @click="delHand(scope.$index,2)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </el-form-item>
        <br>
        <el-form-item label="物流费用总额" prop="totalLogisticsExpenses">
          <el-input v-model="formData.totalLogisticsExpenses"></el-input>
        </el-form-item>
        <el-form-item label="物流辅料费用" prop="logisticsExpensesList">
          <el-button style="margin-left: 50px" size="mini" type="success" @click="openMOreFn(3)">添加</el-button>
          <div style="margin-top: 10px;margin-left: 50px;">
            <el-table :data="formData.logisticsExpensesList">
              <el-table-column align="center" type="index" label="序号"></el-table-column>
              <el-table-column width="100" property="expenseCategory" label="费用类别">
                <template slot-scope="scope">
                  <span v-if="scope.row.expenseCategory==1">物流费</span>
                  <span v-if="scope.row.expenseCategory==2">维修费</span>
                  <span v-if="scope.row.expenseCategory==0">其他</span>
                </template>
              </el-table-column>
              <el-table-column width="100" property="quantity" label="数量"></el-table-column>
              <el-table-column width="100" property="amount" label="金额"></el-table-column>
              <el-table-column width="80" property="model" label="型号"></el-table-column>
              <el-table-column width="100" property="date" label="日期"></el-table-column>
              <el-table-column width="100" property="payer" label="支付方"></el-table-column>
              <el-table-column width="100" label="操作">
                <template slot-scope="scope">
                  <el-button type="danger" size="mini" @click="delHand(scope.$index,3)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </el-form-item>
        <br>
        <el-form-item label="维修费用总额" prop="totalMaintenanceCost">
          <el-input v-model="formData.totalMaintenanceCost"></el-input>
        </el-form-item>
        <el-form-item label="维修配件费用对象" prop="maintenanceCostList">
          <el-button size="mini" type="success" @click="openMOreFn(4)">添加</el-button>
          <div style="margin-top: 30px;background-color: #f1f3f4">
            <el-table :data="formData.maintenanceCostList">
              <el-table-column align="center" width="130" property="expenseCategory" label="费用类别">
                <template slot-scope="scope">
                  <span v-if="scope.row.expenseCategory==1">物流费</span>
                  <span v-if="scope.row.expenseCategory==2">维修费</span>
                  <span v-if="scope.row.expenseCategory==0">其他</span>
                </template>
              </el-table-column>
              <el-table-column align="center" width="130" property="unit" label="单位">
                <template slot-scope="scope">
                  <span v-if="scope.row.unit==0">其他</span>
                  <span v-if="scope.row.unit==1">台</span>
                </template>
              </el-table-column>
              <el-table-column align="center" width="100" property="remark" label="备注"></el-table-column>
              <el-table-column align="center" width="130" property="totalAmount" label="金额"></el-table-column>
              <el-table-column align="center" width="100" label="操作">
                <template slot-scope="scope">
                  <el-button type="danger" size="mini" @click="delHand(scope.$index,4)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </el-form-item>
        <el-form-item label="实收租金" prop="rentPaid">
          <el-input v-model="formData.rentPaid"></el-input>
        </el-form-item>
        <el-form-item label="实收押金" prop="depositPaid">
          <el-input v-model="formData.depositPaid"></el-input>
        </el-form-item>
        <el-form-item label="预估毛利润" prop="estimateProjectProfit">
          <el-input v-model="formData.estimateProjectProfit"></el-input>
        </el-form-item>

      </el-form>
      <span slot="footer" class="dialog-footer">
    <el-button @click="isShow = false">取 消</el-button>
    <el-button type="primary" @click="btnOk">确 定</el-button>
  </span>
    </el-dialog>
    <!-- 租赁订单选择框-->
    <el-dialog
      title="请选择租赁订单"
      :visible.sync="orderListIsShow"
      width="45%" @close="orderClose">
      <el-form :model="orderFrom" inline label-width="100px">
        <el-form-item label="客户姓名" prop="customerName">
          <el-input style="width: 240px" v-model="orderFrom.customerName" placeholder="请选择客户名">
            <template slot="append">
              <el-button type="primary" @click="openProject">
                选择客户
              </el-button>
            </template>
          </el-input>
        </el-form-item>
        <el-form-item label="项目名称" prop="projectName">
          <el-input style="width: 240px" v-model="orderFrom.projectName" placeholder="请输入项目名称">
            <template slot="append">
              <el-button type="primary" @click="openProject">
                选择项目
              </el-button>
            </template>
          </el-input>
        </el-form-item>
        <el-form-item label="订单状态" prop="orderStatus">
          <el-select v-model="orderFrom.orderStatus" placeholder="请选择订单状态">
            <el-option
              v-for="item in OrderOptions"
              :key="item.dictValue"
              :label="item.dictLabel"
              :value="item.dictValue">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <el-button style="margin-bottom: 15px;margin-left: 100px;" size="small" type="success" @click="SearchOrderNo">查询
      </el-button>
      <el-table
        :data="OrderList"
        tooltip-effect="dark"
        style="width: 100%">
        <el-table-column
          label="订单编号"
          prop="orderNo"
          width="120">
        </el-table-column>
        <el-table-column
          prop="customerName"
          label="客户名称"
          width="120">
        </el-table-column>
        <el-table-column
          prop="projectName"
          label="项目名"
          width="120">
        </el-table-column>
        <el-table-column
          prop="salesmanName"
          label="业务员"
          show-overflow-tooltip>
        </el-table-column>
        <el-table-column
          prop="createTime"
          label="创建时间"
          width="180"
          show-overflow-tooltip>
        </el-table-column>
        <el-table-column
          label="操作">
          <template slot-scope="scope">
            <el-button type="success" size="small" @click="checked(scope.row)">选择</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>
    <!--其他项目费用-->
    <el-dialog title="添加其它费用" :visible.sync="otherExpensesShow" width="30%" @close="close">
      <el-form :model="otherExpensesForm" inline label-width="100px">
        <div v-if="figure===1">
          <el-form-item label="费用类别" prop="expenseCategory">
            <el-select v-model="otherExpensesForm.expenseCategory" placeholder="费用类别">
              <el-option
                v-for="item in expenseOptions"
                :key="item.dictValue"
                :label="item.dictLabel"
                :value="item.dictValue"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="单位" prop="unit">
            <el-select v-model="otherExpensesForm.unit" placeholder="单位">
              <el-option
                v-for="item in expenseUnitOptions"
                :key="item.dictValue"
                :label="item.dictLabel"
                :value="item.dictValue"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="数量" prop="quantity">
            <el-input v-model="otherExpensesForm.quantity" placeholder="请输入数量"></el-input>
          </el-form-item>
          <el-form-item label="类别总金额" prop="totalAmount">
            <el-input v-model="otherExpensesForm.totalAmount" placeholder="请输入金额"></el-input>
          </el-form-item>

        </div>
        <div v-if="figure===2">
          <el-form-item label="费用类别" prop="expenseCategory">
            <el-select v-model="otherExpensesForm.expenseCategory" placeholder="费用类别">
              <el-option
                v-for="item in expenseOptions"
                :key="item.dictValue"
                :label="item.dictLabel"
                :value="item.dictValue"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="单位" prop="unit">
            <el-select v-model="otherExpensesForm.unit" placeholder="单位">
              <el-option
                v-for="item in expenseUnitOptions"
                :key="item.dictValue"
                :label="item.dictLabel"
                :value="item.dictValue"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="金额" prop="amount">
            <el-input v-model="otherExpensesForm.amount" placeholder="请输入金额"></el-input>
          </el-form-item>
          <el-form-item label="是否已支付" prop="hasPaid">
            <el-input v-model="otherExpensesForm.hasPaid" placeholder="请输入金额"></el-input>
          </el-form-item>
          <el-form-item label="支付方" prop="payer">
            <el-input v-model="otherExpensesForm.payer" placeholder="支付方"></el-input>
          </el-form-item>
        </div>
        <div v-if="figure===3">
          <el-form-item label="费用类别" prop="expenseCategory">
            <el-select v-model="otherExpensesForm.expenseCategory" placeholder="费用类别">
              <el-option
                v-for="item in expenseOptions"
                :key="item.dictValue"
                :label="item.dictLabel"
                :value="item.dictValue"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="数量" prop="quantity">
            <el-input v-model="otherExpensesForm.quantity" placeholder="请输入数量"></el-input>
          </el-form-item>
          <el-form-item label="金额" prop="amount">
            <el-input v-model="otherExpensesForm.amount" placeholder="请输入金额"></el-input>
          </el-form-item>
          <el-form-item label="型号" prop="model">
            <el-input v-model="otherExpensesForm.model" placeholder="型号"></el-input>
          </el-form-item>
          <el-form-item label="日期" prop="expenseDate">
            <el-date-picker
              v-model="otherExpensesForm.expenseDate"
              type="date"
              @change="change"
              placeholder="选择日期">
            </el-date-picker>
          </el-form-item>
          <el-form-item label="支付方" prop="payer">
            <el-input v-model="otherExpensesForm.payer" placeholder="支付方"></el-input>
          </el-form-item>
        </div>
        <div v-if="figure===4">
          <el-form-item label="费用类别" prop="expenseCategory">
            <el-select v-model="otherExpensesForm.expenseCategory" placeholder="费用类别">
              <el-option
                v-for="item in expenseOptions"
                :key="item.dictValue"
                :label="item.dictLabel"
                :value="item.dictValue"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="单位" prop="unit">
            <el-select v-model="otherExpensesForm.unit" placeholder="单位">
              <el-option
                v-for="item in expenseUnitOptions"
                :key="item.dictValue"
                :label="item.dictLabel"
                :value="item.dictValue"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="备注" prop="remark">
            <el-input v-model="otherExpensesForm.remark" placeholder="备注"></el-input>
          </el-form-item>

          <el-form-item label="金额" prop="totalAmount">
            <el-input v-model="otherExpensesForm.totalAmount" placeholder="请输入金额"></el-input>
          </el-form-item>
        </div>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="otherExpensesShow=false">取 消</el-button>
        <el-button type="primary" @click="handOk">确 定</el-button>
      </span>
    </el-dialog>
    <project-list ref="project" @showProject="showProject"></project-list>
    <import-product ref="importProduct" @showProduct="showProduct"></import-product>
  </div>
</template>
<script>
import {
  getStatementListApi,
  getStatementInfoApi,
  addStatementApi,
  editStatementApi,
  delStatementApi,
  getMachineListExpenseApi
} from '@/api/module/statemente'
import {listOrder, updateOrder} from '@/api/module/order'
import {getReturnApplyApi} from '@/api/module/backwarehouses'
import {getDicts} from "@/api/system/dict/data";
import {formatDate} from "@/utils";
import ProjectList from '@/views/module/order/project'
import {getLogisticsListApi} from '@/api/module/logistics'
import {repairListApi} from '@/api/module/repair'
import {getMachineRecordApi} from '@/api/module/machine'
import {listCost} from '@/api/module/cost'
import importProduct from "@/views/dialog/product";

export default {
  name: 'Statement',
  components: {ProjectList, importProduct},
  data() {
    return {
      formData: {
        contractTemplate: null,// 合同模板
        sponsor: null,//发起人
        sponsorName: null,//e		发起人名称
        salesman: null,//	业务员
        salesmanName: null,//		业务员名称
        applyDate: null,//	申请日期1
        number: null,//		编号1
        customerId: null,//客户
        customerName: null,//	客户名称
        businessCompany: null,//		业务所属公司
        orderId: null,//	订单id
        orderNo: null,//订单编号
        projectName: null,//		项目名称
        projectSource: null,//		项目信息来源
        startDate: null,//	起租日期1
        endDate: null,//	到租日期1
        usedDays: null,//使用天数1
        totalDailyRent: null,//日租金合计
        rentReceivable: null,//应收租金
        rentAllowanceAmount: null,//租金折让金额
        rentAllowanceDescription: null,//折让说明
        relationApprovalForm: null,//关联特殊事项审批单
        totalOtherExpenses: null,//其他费用总额
        rentPaid: null,// 实收租金
        depositPaid: null,// 实收押金
        refundableDeposit: null,// 应退押金
        accountStatementAttachments: null,//		对账单附件
        accountNumber: null,//		帐户信息附件
        totalDeductibleExpenses: null,// 	应扣费用总额
        totalLogisticsExpenses: null,// 	物流费用总额
        totalMaintenanceCost: null,//维修费用总额
        estimateProjectProfit: null,//预估项目毛利
        signRenId: '',//	签订人id
        signRenName: '',//	签订人名称
        collaborator: null,//			协同人id
        collaboratorName: null,//	协同人名称
        otherExpensesList: [],//		收取客户其他费用
        deductibleExpensesList: [],//项目应扣费用对象
        logisticsExpensesList: [],//	物流及辅料费用对象
        maintenanceCostList: [],//[维修、配件费用对象
        statementExpensesList: [],//费用结算表
        pageSize: 10,
        pageNum: 1
      },
      statementExpensesList: [],//费用结算表

      otherExpensesShow: false,
      figure: null,
      otherExpensesForm: {},//其他费用
      // deductibleExpensesForm:{},//项目应扣
      // logisticsExpensesForm:{},//物流
      // maintenanceCostForm:{},
      total: null,
      formRules: {
        orderNo: [{required: 'true', message: '请输入订单编号', trigger: 'blur'}],
        contractTemplate: [{required: 'true', message: '请选择合同模板', trigger: 'blur'}],
        sponsorName: [{required: 'true', message: '请选择发起人', trigger: 'blur'}],
        salesmanName: [{required: 'true', message: '请选择业务员', trigger: 'blur'}],
        applyDate: [{required: 'true', message: '请选择申请日期', trigger: 'blur'}],
        number: [{required: 'true', message: '对账单编号', trigger: 'blur'}],
        customerName: [{required: 'true', message: '客户名', trigger: 'blur'}],
        businessCompany: [{required: 'true', message: '业务所属公司', trigger: 'blur'}],
        projectName: [{required: 'true', message: '项目名', trigger: 'blur'}],
        projectSource: [{required: 'true', message: '项目来源', trigger: 'blur'}],
        totalDailyRent: [{required: 'true', message: '日租金合计', trigger: 'blur'}],
        rentReceivable: [{required: 'true', message: '应收租金', trigger: 'blur'}],
        signRenName: [{required: 'true', message: '签订人', trigger: 'blur'}],
        collaboratorName: [{required: 'true', message: '协同人', trigger: 'blur'}],
      },
      list: [],
      isShow: false,//否打开弹框
      orderListIsShow: false,//租赁订单框
      OrderList: [],//租赁订单列表
      orderFrom: {
        projectName: '',
        customerName: '',//客户名称
        orderStatus: '4'
      },
      getDays: null,
      //项目信息来源
      ProjectCompanyOptions: [],
      //订单状态
      OrderOptions: [],
      contractTemplateOptions: [],//合同模板
      projectSourceOptions: null,
      expenseOptions: [],//费用类别
      expenseUnitOptions: [],//费用单位
      machineExpenseList: [],//机器租金
      totalMachineExpense: 0,
      businessCompany: ''

    }
  },
  watch: {
    'formData.totalDailyRent': {
      handler(newName, oldName) {

      },
      // immediate:true,
      deep: true
    }
  },
  created() {
    this.getList()
    this.getProjectSourceOptions()//获取项目信息来源
    this.getProjectCompony()//业务所属公司
    this.getContractTemplateOptions()//合同
    this.getOrderTypeOptions()
    this.getExpenseOptions()//费用类别
    this.getExpenseUnitOptions()
  },
  methods: {
    // 获取租赁对账单列表
    async getList() {
      let res = await getStatementListApi(this.formData)
      console.log(res)
      res.rows.forEach(item => {
        item.businessCompany = this.getValue(this.ProjectCompanyOptions, item.businessCompany)
      })
      this.list = res.rows
      this.total = res.total
    },
    //  获取合同模板
    async getContractTemplateOptions() {
      let res = await getDicts('biz_contract_template')
      this.contractTemplateOptions = res.data
    },
    async getOrderTypeOptions() {
      let res = await getDicts('order_type')
      this.OrderOptions = res.data
    },
    //  获取费用类别
    async getExpenseOptions() {
      let res = await getDicts('expense_type')
      this.expenseOptions = res.data
    },
    //  获取项目单位
    async getExpenseUnitOptions() {
      let res = await getDicts('expense_type_unit')
      this.expenseUnitOptions = res.data
    },
    //  搜索按钮
    Search() {
      this.getList()
    },
    //  重置按钮
    ResetList() {
      this.formData = {}//清空表单
      this.getList()
    },

    handleSizeChange(val) {
      this.formData.pageSize = val
      this.getList()
    },
    handleCurrentChange(val) {
      this.formData.pageNum = val
      this.getList()
    },
    //  弹框打开
    openDialog() {
      this.isShow = true
    },
    //费用列表弹框打开
    openMOreFn(val) {
      this.figure = val
      this.otherExpensesShow = true
    },
    close() {
      this.otherExpensesForm = {}
    },
    change(value) {

      console.log(this.formatDate(value))
      this.otherExpensesForm.date = this.formatDate(value)
    },
    //费用事件明细
    handOk() {
      if (this.figure === 1) {
        this.formData.otherExpensesList.push(this.otherExpensesForm)
        this.formData.totalOtherExpenses = 0
        this.formData.otherExpensesList.forEach(item => {
          this.formData.totalOtherExpenses += Number(item.totalAmount)

        })

      }
      if (this.figure === 2) {
        this.formData.deductibleExpensesList.push(this.otherExpensesForm)
        this.formData.totalDeductibleExpenses = 0
        this.formData.deductibleExpensesList.forEach(item => {
          this.formData.totalDeductibleExpenses += Number(item.amount)
        })
      }
      if (this.figure === 3) {
        this.formData.logisticsExpensesList.push(this.otherExpensesForm)
        this.formData.totalLogisticsExpenses = 0
        this.formData.logisticsExpensesList.forEach(item => {
          this.formData.totalLogisticsExpenses += Number(item.amount)
        })
      }
      if (this.figure === 4) {
        this.formData.maintenanceCostList.push(this.otherExpensesForm)
        this.formData.totalMaintenanceCost = 0
        this.formData.maintenanceCostList.forEach(item => {
          this.formData.totalMaintenanceCost += Number(item.totalAmount)
        })
      }
      this.otherExpensesShow = false
      this.$nextTick(function () {
        // 应收租金
        this.formData.rentReceivable = 0

        this.formData.rentReceivable += Number(this.totalMachineExpense) + Number(this.formData.totalOtherExpenses)
          + Number(this.formData.totalDeductibleExpenses) + Number(this.formData.totalLogisticsExpenses)
          + Number(this.formData.totalMaintenanceCost)
        console.log('11')
      })
    },
    //删除明细
    async delHand(index, val) {
      if (val === 1) {
        await this.$confirm('是否确认删除')
        this.formData.otherExpensesList.splice(index, 1)
        this.formData.totalOtherExpenses = 0
        this.formData.otherExpensesList.forEach(item => {
          this.formData.totalOtherExpenses += Number(item.totalAmount)

        })
      }
      if (val === 2) {
        await this.$confirm('是否确认删除')
        this.formData.deductibleExpensesList.splice(index, 1)
        this.formData.totalDeductibleExpenses = 0
        this.formData.deductibleExpensesList.forEach(item => {
          this.formData.totalDeductibleExpenses += Number(item.amount)
        })
      }
      if (val === 3) {
        await this.$confirm('是否确认删除')
        this.formData.logisticsExpensesList.splice(index, 1)
        this.formData.totalLogisticsExpenses = 0
        this.formData.logisticsExpensesList.forEach(item => {
          this.formData.totalLogisticsExpenses += Number(item.amount)
        })
      }
      if (val === 4) {
        await this.$confirm('是否确认删除')
        this.formData.maintenanceCostList.splice(index, 1)
        this.formData.totalMaintenanceCost = 0
        this.formData.maintenanceCostList.forEach(item => {
          this.formData.totalMaintenanceCost += Number(item.totalAmount)
        })
      }
      this.$nextTick(function () {
        // 应收租金
        this.formData.rentReceivable = 0

        this.formData.rentReceivable += Number(this.totalMachineExpense) + Number(this.formData.totalOtherExpenses)
          + Number(this.formData.totalDeductibleExpenses) + Number(this.formData.totalLogisticsExpenses)
          + Number(this.formData.totalMaintenanceCost)
        console.log('11')
      })
    },
    validateNumberInput(e, item) {
      let value = e.target.value.replace(/[^\d.]/g, '').replace(/\.{2,}/g, '.').replace('.', '$#$').replace(/\./g, '').replace('$#$', '.').replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3');
      if (value >= 999999999.99) {
        this.formData[item] = 999999999.99;
      } else {
        this.formData[item] = value;
      }
    },
    blurNumberInput(e, item) {
      if (e.target.value && e.target.value.indexOf('.') <= 0) {
        this.formData[item] = e.target.value + '.00'
      }
    },


    async DialogClose() {
      this.OrderList = []
      this.formData = {
        contractTemplate: null,// 合同模板
        sponsor: null,//发起人
        sponsorName: null,//e		发起人名称
        salesman: null,//	业务员
        salesmanName: null,//		业务员名称
        applyDate: null,//	申请日期1
        number: null,//		编号1
        customerId: null,//客户
        customerName: null,//	客户名称
        businessCompany: null,//		业务所属公司
        orderId: null,//	订单id
        orderNo: null,//订单编号
        projectName: null,//		项目名称
        projectSource: null,//		项目信息来源
        startDate: null,//	起租日期1
        endDate: null,//	到租日期1
        usedDays: null,//使用天数1
        totalDailyRent: null,//日租金合计
        rentReceivable: null,//应收租金
        rentAllowanceAmount: null,//租金折让金额
        rentAllowanceDescription: null,//折让说明
        relationApprovalForm: null,//关联特殊事项审批单
        totalOtherExpenses: null,//其他费用总额
        rentPaid: null,// 实收租金
        depositPaid: null,// 实收押金
        refundableDeposit: null,// 应退押金
        accountStatementAttachments: null,//		对账单附件
        accountNumber: null,//		帐户信息附件
        totalDeductibleExpenses: null,// 	应扣费用总额
        totalLogisticsExpenses: null,// 	物流费用总额
        totalMaintenanceCost: null,//维修费用总额
        estimateProjectProfit: null,//预估项目毛利
        signRenId: '',//	签订人id
        signRenName: '',//	签订人名称
        collaborator: null,//			协同人id
        collaboratorName: null,//	协同人名称
        otherExpensesList: [],//		收取客户其他费用
        deductibleExpensesList: [],//项目应扣费用对象
        logisticsExpensesList: [],//	物流及辅料费用对象
        maintenanceCostList: [],//[维修、配件费用对象


      }
      this.totalMachineExpense = 0
      this.machineExpenseList = []
      await this.getList()
    },

    //  租赁订单选择项目+客户
    //打开项目弹框
    openProject() {
      this.$refs.project.isShow = true
    },
    showProject(data) {
      console.log(data)
      this.orderFrom.projectName = data.projectName
      this.orderFrom.customerName = data.customerName
    },
    // 弹框关闭

    // 关闭
    orderClose() {
      this.orderFrom = {
        projectName: '',
        customerName: '',//客户名称
        orderStatus: '4'
      }
    },
    //弹框打开
    async OpenOrderList() {
      this.orderListIsShow = true
      let res = await listOrder(this.orderFrom)
      this.OrderList = res.rows//首次打开默认筛选所有未出库状态
      this.formData.number = this.setOrderNo()//生成从对账单编号


    },
    // 查询按钮
    async SearchOrderNo() {
      let res = await listOrder(this.orderFrom)
      this.OrderList = res.rows

    },
    /** 打开产品弹窗 */
    openProduct() {
      this.$refs.importProduct.show();
      console.log(this.$refs.importProduct.show())
    },
    showProduct(data) {
      this.statementExpensesList.push(...data);
      console.log(this.statementExpensesList)
    },
    removeProduct(index) {
      this.statementExpensesList.splice(index, 1)
      this.setDailyTotalRent()
    },
    // 计算天数
    async sumMoney(idx) {
      console.log(idx);
      console.log(this.statementExpensesList)
      this.statementExpensesList[idx].days = this.getDayBetween(this.formatDate(this.statementExpensesList[idx].startDate), this.formatDate(this.statementExpensesList[idx].endDate))
      console.log(this.statementExpensesList[idx].days);
      this.statementExpensesList[idx].grossRent = parseFloat(this.statementExpensesList[idx].days) * parseFloat(this.statementExpensesList[idx].dailyRent) * parseFloat(this.statementExpensesList[idx].quantity)
      console.log(this.statementExpensesList[idx].grossRent);
      await this.setDailyTotalRent(idx)
    },
    setDailyTotalRent(index) {

      //计算日租金
      let total = 0
      let arr = []
      this.statementExpensesList.forEach((item, index) => {
        if (item.quantity && item.dailyRent) {
          total = parseFloat(item.quantity) * parseFloat(item.dailyRent) * parseFloat(item.days);
          arr.push(total)
        }
        // console.log(arr)
        let sum = arr.reduce(function (prev, cur, index) {
          return prev + cur;
        })
        // console.log(sum)
        this.totalMachineExpense = sum

      })
      // 应该收租金
      this.formData.rentReceivable = 0
      this.formData.rentReceivable += Number(this.totalMachineExpense) + Number(this.formData.totalOtherExpenses)
        + Number(this.formData.totalDeductibleExpenses) + Number(this.formData.totalLogisticsExpenses)
        + Number(this.formData.totalMaintenanceCost)
    },
    //生成出库订单编号
    setOrderNo() {
      var date = new Date();
      var year = date.getFullYear();        //年 ,从 Date 对象以四位数字返回年份
      var month = date.getMonth() + 1;      //月 ,从 Date 对象返回月份 (0 ~ 11) ,date.getMonth()比实际月份少 1 个月
      var day = date.getDate();             //日 ,从 Date 对象返回一个月中的某一天 (1 ~ 31)
      //修改月份格式
      if (month >= 1 && month <= 9) {
        month = "0" + month;
      }
      //修改日期格式
      if (day >= 0 && day <= 9) {
        day = "0" + day;
      }

      let round = Math.floor(Math.random() * (999 - 100)) + 100;
      var currentFormatDate = `${year}${month}${day}`;
      return "DZ" + currentFormatDate + round;
    },
    //选中订单编号
    async checked(val) {
      this.formData.orderNo = val.orderNo
      this.orderListIsShow = false
      this.OrderList = []
      let res = await listOrder(this.formData)//获取关租赁订单

      console.log(res.rows[0].id)
      this.formData.contractTemplate = res.rows[0].contractTemplate
      this.formData.sponsor = res.rows[0].sponsor
      this.formData.sponsorName = res.rows[0].sponsorName
      this.formData.salesman = res.rows[0].salesman
      this.formData.salesmanName = res.rows[0].salesmanName
      this.formData.signRenId = res.rows[0].sponsor
      this.formData.signRenName = res.rows[0].sponsorName
      this.formData.customerId = res.rows[0].customerId
      this.formData.customerName = res.rows[0].customerName

      this.formData.businessCompany = res.rows[0].businessCompany
      this.businessCompany = this.getValue(this.ProjectCompanyOptions, res.rows[0].businessCompany)
      this.formData.orderId = res.rows[0].id
      this.formData.projectName = res.rows[0].projectName
      this.formData.projectSource = res.rows[0].projectSource
      this.formData.totalDailyRent = res.rows[0].totalDailyRent
      this.formData.rentReceivable = res.rows[0].totalRant
      this.formData.collaboratorName = res.rows[0].collaboratorName
      this.formData.collaborator = res.rows[0].collaborator
      this.formData.depositPaid = res.rows[0].receivedAmount
      let res1 = await getMachineListExpenseApi({orderId: this.formData.orderId})
      console.log(res1)
      res1.rows.forEach((item, value) => {
        if (item.machine_id) {
          item.machineId = item.machine_id;
          delete item.machine_id;
        }
        if (item.machine_no) {
          item.machineNo = item.machine_no;
          delete item.machine_no;
        }

        if (item.product_id) {
          item.productId = item.product_id;
          delete item.product_id;
        }
        if (item.product_name) {
          item.productName = item.product_name;
          delete item.product_name;
        }
        if (item.product_no) {
          item.productNo = item.product_no;
          delete item.product_no;
        }

        if (item.all_time) {
          item.allTime = item.all_time
          delete item.all_time
        }
        if (item.order_id) {
          item.orderId = item.order_id
          delete item.order_id
        }

      });
      console.log(res1.rows)
      res1.rows.forEach(item => {
        item.outtime = this.formatDate(item.outtime)
        item.retime = this.formatDate(item.retime)
        this.totalMachineExpense += Number(item.rent)
      })

      this.machineExpenseList = res1.rows
      // 获取物流费用
      let res2 = await getLogisticsListApi({orderId: this.formData.orderId})
      console.log(res2)
      res2.rows.forEach(item => {
        let newItem = {}
        if (item.createTime) {
          newItem.date = item.createTime
          delete item.createTime
        }
        if (item.logisticsExpenses) {
          newItem.amount = item.logisticsExpenses
          delete item.logisticsExpenses
        }
        newItem.expenseCategory = 1
        newItem.orderId = null
        newItem.orderType = 1
        newItem.quantity = null
        newItem.model = null
        newItem.payer = null

        this.formData.logisticsExpensesList.push(newItem)
      })
      console.log(res2.rows)
      this.formData.totalLogisticsExpenses = 0
      this.formData.logisticsExpensesList.forEach(item => {
        this.formData.totalLogisticsExpenses += Number(item.amount)
      })
      // 获取对相应维修费用
      let res3 = await repairListApi({orderId: this.formData.orderId})
      console.log(res3)
      res3.rows.forEach(item => {
        let newItem = {}
        if (item.repairAmount) {
          newItem.totalAmount = item.repairAmount
        }
        if (item.repairDescription) {
          newItem.remark = item.repairDescription
          delete item.repairDescription
        }
        newItem.expenseCategory = 2
        newItem.orderId = null
        newItem.orderType = 1
        newItem.unit = null
        this.formData.maintenanceCostList.push(newItem)
      })
      console.log(res3)
      this.formData.totalMaintenanceCost = 0
      this.formData.maintenanceCostList.forEach(item => {
        this.formData.totalMaintenanceCost += Number(item.totalAmount)
      })
      // 工程费获取/放在项目其项目应扣费用

      let res4 = await listCost({orderNo: this.formData.orderNo})
      res4.rows.forEach(item => {
        let newItem = {}
        if (item.days) {
          newItem.quantity = item.days
        }
        if (item.costs) {
          newItem.totalAmount = item.costs
        }
        newItem.expenseCategory = 3
        newItem.orderType = 1
        newItem.unit = 2
        this.formData.otherExpensesList.push(newItem)
      })
      this.formData.totalOtherExpenses = 0
      this.formData.otherExpensesList.forEach(item => {
        this.formData.totalOtherExpenses += Number(item.totalAmount)
      })
      // 应收租金
      this.formData.rentReceivable = 0

      this.formData.rentReceivable += Number(this.totalMachineExpense) + Number(this.formData.totalOtherExpenses)
        + Number(this.formData.totalDeductibleExpenses) + Number(this.formData.totalLogisticsExpenses)
        + Number(this.formData.totalMaintenanceCost)
    },
    DayFn() {
      this.formData.usedDays = this.getDayBetween(this.formatDate(this.formData.startDate), this.formatDate(this.formData.endDate))
    },
    //格式转换
    formatDate(d) {
      var date = new Date(d);
      var YY = date.getFullYear() + '-';
      var MM =
        (date.getMonth() + 1 < 10
          ? '0' + (date.getMonth() + 1)
          : date.getMonth() + 1) + '-';
      var DD = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();

      return YY + MM + DD
    },

    //计算天数
    getDayBetween(start, end) {
      var startDate = Date.parse(start)
      var endDate = Date.parse(end)
      if (startDate > endDate) {
        return this.$message('请重新确认日期')
      }
      if (startDate == endDate) {
        return 1
      }
      var days = (endDate - startDate) / (1 * 24 * 60 * 60 * 1000)
      return days
    },
    // 获取项目信息来源
    getProjectSourceOptions() {
      getDicts('biz_project_source').then(response => {
        this.projectSourceOptions = response.data
      })
    },
    //  获取所属公司
    getProjectCompony() {
      getDicts('biz_business_company').then(respons => {
        this.ProjectCompanyOptions = respons.data
      })
    },
    getValue(arr, item) {
      for (let i = 0; i < arr.length; i++) {
        if (item === arr[i].dictValue) {
          return arr[i].dictLabel
        }
      }
    },
    //  修改
    async editFn(val) {
      this.formData.id = val.id
      //  获取信息
      let res = await getStatementInfoApi(val.id)
      this.formData = res.data
      this.isShow = true
    },
    async btnOk() {
      // 表单验证
      try {
        await this.$refs.form.validate();
        if (this.formData.id) {
          await editStatementApi(this.formData)
          this.$message('修改成功')
        } else {
          await addStatementApi(this.formData)
          this.$message('添加成功')
        }
        this.isShow = false
      } catch (error) {
        console.log(error);
      }


    },
    //删除
    async delFn(val) {
      await this.$confirm("是否确认删除");
      await delStatementApi(val)
      this.$message.success('删除成功')
      await this.getList()
    }

  }
}
</script>
